<template>
	<view class="page" :style="{minHeight:$height()}">
		<view class="item" v-for="(item,index) in list" :key="item.id" @click="$next(`/pages/contract/fillContract?id=${item.id}`)" v-if="item.type == 0">
			<view class="icon-title-box">
				<view class="Icon fristColor" >
					<image src="@/static/ICON/laodong.png" style="width: 24rpx; height: 30rpx;" ></image>
				</view>
				<text>{{item.company.name}}-{{item.name}}</text>
			</view>
			<u-icon name="arrow-right" class="i"></u-icon>
		</view>
		<!-- 加载更多 -->
		<u-loadmore v-if="list.length !== 0" :status="status" :load-text="loadText" />
		<image v-else src="@/static/image/empty.png" mode="widthFix" class="is-empty"></image>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				// 页面数据初始化状态
				loadText: {
					loadmore: '轻轻上拉，加载更多',
					loading: '努力加载中',
					nomore: '我也是有底线的'
				},
				more: false,
				page: 1, //页码
				limit: 15, //条数
				list:[],
			}
		},
		onShow() {
			
		},
		onLoad() {
			this.getTemplate()
		},
		methods:{
			getTemplate(){
				this.$axios.request(this.$api.getContractRes,"GET",{
					limit:this.limit,
					page:this.page,
					orderField: 'id',
					order: 'desc'
				}).then((val) => {
					uni.stopPullDownRefresh();
					this.list = this.page == 1 ? val.data.list : this.list.concat(val.data.list)
					if (Math.ceil(val.data.total / this.limit) > this.page) {
						this.more = true;
						this.page++
					} else {
						this.more = false;
					}
				})
			}
		}
		
	}
</script>

<style>
	.page {
		width: 100%;
		padding: 35rpx 20rpx;
		overflow-y: auto;
	}

	.item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		height: 84rpx;
		padding: 0 25rpx 0 20rpx;
		background: rgba(0, 0, 0, 0.01);
		margin-bottom: 16rpx;
	}

	.icon-title-box {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		width: 600rpx;
		height: 100%;
	}

	.Icon {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 48rpx;
		height: 48rpx;
		background-color: #2C405A;
		margin-right: 50rpx;
	}
	.fristColor {
		background-color: #FFA12A;
	}
	text {
		height: 45rpx;
		font-size: 32rpx;
		font-family: "PingFang SC";
		font-weight: 400;
		line-height: 45rpx;
		color: #707070;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.i {
		font-size: 36rpx;
		font-family: "PingFang SC";
		font-weight: 400;
		line-height: 45rpx;
		color: #707070;
	}
	.page .item:last-child {
		margin-bottom: 36rpx;
	}
	.loadMore {
		height: 33rpx;
		font-size: 24rpx;
		font-family: "PingFang SC";
		font-weight: 300;
		line-height: 33rpx;
		color: #BBBBBB;
		text-align: center;
		opacity: 1;
	}
</style>
